<template>
    <view class="l-countdown l-class">
        <view class="l-countdown-item" v-for="(item, index) in date" :key="index">
            <text class="l-class-time l-time-class l-countdown-time">{{ item.value }}</text>

            {{ item.name }}
        </view>
    </view>
</template>

<script>
import countDownBehaviors from '../behaviors/countdown';
export default {
    externalClasses: ['l-class', 'l-class-time', 'l-time-class'],
    mixins: [countDownBehaviors],

    props: {
        doneText: {
            type: String,
            default: '已结束'
        }
    },

    methods: {},
    created: function () {}
};
</script>
<style>
.l-countdown {
    font-size: 28rpx;
    line-height: 40px;
}
.l-countdown-item {
    display: inline-block;
    color: inherit;
}
.l-countdown-time {
    display: inline-flex;
    width: 56rpx;
    height: 56rpx;
    background: #45526b;
    border-radius: 4rpx;
    color: #fff;
    align-items: center;
    justify-content: center;
    margin: 0 16rpx;
}
</style>
